<template>
  <!--  &lt;!&ndash;增加教室&#45;&#45-->
  <div style="padding: 20px">
    <el-form :inline="true" :model="form" :rules="rules" ref="ruleForm">
      <el-form-item label="教室号" >
        <el-input v-model="form.roomid" rules="name" ref="ruleForm" placeholder="请输入教室号"></el-input>
      </el-form-item>
      <el-form-item label="教室状态">
        <el-radio v-model="form.state" label="空闲">空闲</el-radio>
        <el-radio v-model="form.state" label="忙碌">忙碌</el-radio>
        <!--        <el-select v-model="form.state" placeholder="点击选择">-->
        <!--          <el-option label="空闲" value="空闲"></el-option>-->
        <!--          <el-option label="忙碌" value="忙碌"></el-option>-->
        <!--        </el-select>-->
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="add">添加</el-button>
        <el-popover
            ref="popover5"
            placement="top"
            width="160">
          <p>确定删除该教务设备吗？</p>
          <div style="text-align: right; margin: 0">
            <el-button type="primary" size="mini" @click="del">确定</el-button>
          </div>
        </el-popover>
        <el-button v-popover:popover5 type="danger" style="margin-left: 5px;">删除</el-button>

      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import request from "@/utils/request";

export default {
  name: "AddRoom.vue",
  data() {
    // var checkAge = (rule, value, callback) => {
    //   if (!value) {
    //     return callback(new Error('年龄不能为空'));
    //   }
    //   setTimeout(() => {
    //     if (!Number.isInteger(value)) {
    //       callback(new Error('请输入数字值'));
    //     } else {
    //       if (value < 18) {
    //         callback(new Error('必须年满18岁'));
    //       } else {
    //         callback();
    //       }
    //     }
    //   }, 1000);
    // };

    //const checkPhone = (rule, value , callback) => {
    // if (!/^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(value)){
    //   callback(new Error('请输入正确的手机号'));
    // }
    //    callback(); 判断一个十一位且以一开头的数字电话号码
    return {
      form: {state:'空闲'},
      rules: {
        name: [
          { required: true, message: '请输入活动名称', trigger: 'blur' }
        ],
        // age: [{validator: validatePass2, trigger: 'blur'}]控制名字是int型并在一个合理数字（该条件限制为十八岁）
      },
    }
  },
  methods: {
    add() {
      // this.$refs['ruleForm'].validate((valid) => {
      //   if (valid) {}
      // })  用于判断是否是存在
      request.post('/room/add', this.form).then(res => {
        if (res.code === '200') {
          this.$notify.success('新增成功')
          this.form = {state: '空闲'}.resetFields() //resetFields清空表单
        } else {
          this.$notify.error(res.msg)
        }
      })
    },
    del() {
      request.post('/room/delete', this.form).then(res => {
        if (res.code === '200') {
          this.$notify.success('删除成功')
          this.load()
        } else {
          this.$notify.error(res.msg + '删除失败')
        }
      })
    },
  }
}
</script>

<style scoped>

</style>
